<template>
    <div>
        <div class="brand">
            <breadcrumb :arrayName="brand" :hasIcon="hasIcon"></breadcrumb>
        </div>
    
        <div class="container container-top " >
            <el-form  label-width="150px"  :model="win" :rules="winRules"   ref="win" >
                <el-collapse v-model="showCollapse" accordion>
                    <el-collapse-item name="1" class="search-collapse-title">
                        <template slot="title">
                            <span class="vertical-bar" style="margin:0;" ></span>
                            <font  class="collapse-content" >{{$t('te.add')}}( <font >*</font> {{$t('te.must_fill')}})</font>
                        </template>

                        <div class="div-form">
                            <el-row>
                                <el-col :span="12">
                                    <el-form-item  :label="$t('fe.winLevel')"  prop="cudWinLevel" >
                                        <el-select  class="form-input" v-model="win.cudWinLevel" size="small" :placeholder="$t('fe.pselect')" >
                                            <el-option label="一等奖" value="1"></el-option>
                                            <el-option label="二等奖" value="2"></el-option>
                                            <el-option label="三等奖" value="3"></el-option>
                                        </el-select>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="12">
                                    <el-form-item :label="$t('fe.prizeAmount')" prop="cudPrizeAmount" >
                                        <el-input   size="small" class="form-input" v-model="win.cudPrizeAmount" ></el-input>
                                    </el-form-item>
                                </el-col>
                            </el-row>

                            <el-row>
                                <el-col :span="12">
                                    <el-form-item :label="$t('fe.winName')" prop="cudWinName" >
                                        <el-input  class="form-input" v-model="win.cudWinName" size="small"  ></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="12">
                                    <el-form-item :label="$t('fe.phone')" prop="cudPhone" >
                                        <el-input class="form-input"  v-model="win.cudPhone" size="small"  ></el-input>
                                    </el-form-item>
                                </el-col>
                            </el-row>

                            <el-row>
                                <!--中奖日期-->
                                <el-col :span="12">
                                    <el-form-item :label="$t('fe.winDate')" prop="cudWinDate" >
                                        <el-date-picker  class="form-input" v-model="win.cudWinDate" type="date" size="small" >
                                        </el-date-picker>
                                    </el-form-item>
                                </el-col>

                                <el-col :span="12">
                                    <el-form-item :label="$t('fe.awardDate')" prop="cudAwardDate" >
                                        <el-date-picker class="form-input"  v-model="win.cudAwardDate" type="date"   size="small"  >
                                        </el-date-picker>
                                    </el-form-item>
                                </el-col>
                            </el-row>

                            <el-row>
                                <!-- 奖金性质 -->
                                <el-col :span="24">
                                    <el-form-item :label="$t('fe.bonusProperty')" >
                                        <el-checkbox-group size="small" v-model="win.cudBonusProperty">
                                          <el-checkbox label="1">月度奖</el-checkbox>
                                          <el-checkbox label="2">季度奖</el-checkbox>
                                          <el-checkbox label="3">年度奖</el-checkbox>
                                 
                                          <el-checkbox label="4">个人奖</el-checkbox>
                                          <el-checkbox label="5">模块奖</el-checkbox>
                              
                                          <el-checkbox label="6">单项奖</el-checkbox>
                                          <el-checkbox label="7">综合奖</el-checkbox>
                                        </el-checkbox-group>
                                    </el-form-item>
                                </el-col>
                            </el-row>

                            <el-row>
                                <!-- 收款方式 -->
                                <el-col :span="24">
                                    <el-form-item :label="$t('fe.payType')" prop="cudPayType" >
                                        <el-radio-group size="small" v-model="win.cudPayType">
                                            <el-radio label="1">银行卡</el-radio>
                                            <el-radio label="2">现金</el-radio>
                                        </el-radio-group>
                                    </el-form-item>
                                </el-col>
                            </el-row>

                            <el-row>
                                <!--收款账号-->
                                <el-col :span="12">
                                    <el-form-item :label="$t('fe.bankCardNo')">
                                        <el-input size="small" class="form-input" placeholder="若收款方式为银行卡,请填写" v-model="win.cudBankCardNo"  ></el-input>
                                    </el-form-item>
                                </el-col>
                            </el-row>

                            <el-row>
                                <el-col :span="24">
                                    <el-form-item :label="$t('fe.winTalk')" >
                                        <el-input size="small" v-model="win.cudWinSpeech"  style="width:89.5%;" type="textarea">

                                        </el-input>        
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <el-row>
                                <el-col :span="24">
                                    <el-form-item :label="$t('fe.memo')" >
                                        <el-input size="small" v-model="win.memo"  style="width:89.5%;" type="textarea">

                                        </el-input>        
                                    </el-form-item>
                                </el-col>
                            </el-row>

                            <el-row>
                                <el-col :span="24">
                                    <el-form-item :label="$t('fe.uploadFile')" >
                                        <el-upload :show-file-list="false" 
                                        :action="fileUploadUrl" 
                                        :on-success="upfileBack"
                                        :flie-list="fileList" 
                                        :with-credentials ="true"
                                        :before-upload="beforeUpload"
                                        :on-progress="loadingFile"
                                        :on-error="uplofileError"
                                        >
                                            <el-button class="btn-second" size="small" >{{$t('fe.upload')}}</el-button>
                                        </el-upload>           
                                    </el-form-item>
                                </el-col>
                            </el-row>

                            <el-row>
                                <el-col :span="24">
                                    <el-form-item :label="$t('fe.fileList')" >
                                        <!--上传的文件列表-->
                                        <download  style="width:89.5%;" :showLoading="loading" :showBrand="false" @delData="delFiles" :showUpload="false" :showDel="true" :datalist='fileListDownLoad' :props="fileProps" > </download>               
                                    </el-form-item>
                                </el-col>
                            </el-row>
                        </div>

                    </el-collapse-item>    
                </el-collapse>

            </el-form>
        </div>

        <!-- 固定按钮的位置 -->
        <!--使用组件的方式来进行-->
        <fixedbutton>
            <div slot="fixbtn">
                <el-button class="btn-default"  size="small" @click="addProc" >{{$t('cm.commit')}}</el-button>
                <el-button class="btn-second" size="small" @click="back">{{$t('cm.return')}}</el-button>
            </div> 
        </fixedbutton>
    
    </div>
</template>


<script>
    import redemp_add from './js/redemp_add.js'
    export default redemp_add
</script>


<style scoped>

</style>